<template>
    <div>
        <el-button type="primary" @click="showDialog1('insert')">添加配置表</el-button>
        <el-popover placement="bottom-start" width="1000" style="box-shadow: 0 0 8px rgba(0,0,0,.5);" trigger="click">
            <el-form :inline="true" :model="search">
                    <el-form-item label="名称" >
                        <el-input v-model="search.name" style="width: 100px;"></el-input>
                    </el-form-item>
                    <el-form-item label="编码">
                        <el-input v-model="search.code" style="width: 100px;"></el-input>
                    </el-form-item>
                    <el-form-item label="是否启用">
                        <el-select v-model="search.isEnable" placeholder="请选择">
                             <el-option label="【空】" value=""></el-option>
                            <el-option label="启用" value="1"></el-option>
                            <el-option label="未启用" value="0"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="机型">
                        <el-select v-model="search.type" placeholder="请选择">
                            <el-option label="【空】" value="" ></el-option>
                            <el-option :label="item.type" :value="item.id" v-for="item in allType" :key="item.id"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-button type="primary" @click="searchData" icon="el-icon-search">查询</el-button>
                </el-form>
            <el-button slot="reference" type="primary">查询</el-button>
        </el-popover>
        <el-table :data="tableData" :highlight-current-row="true" stripe border class="table-index" :height="tableHeight" style="width: 100%;" :header-cell-style="getRowClass" >
            <el-table-column fixed type="index" label="*" sortable min-width="40"></el-table-column>
            <el-table-column prop="name" label="名称" sortable min-width="160"></el-table-column>
            <el-table-column prop="code" label="编码" sortable min-width="120"></el-table-column>
            <el-table-column prop="typeName" label="机型" sortable  min-width="130"></el-table-column>
            <el-table-column prop="rank" label="工序生产顺序" sortable  min-width="130"></el-table-column>
            <el-table-column prop="useTime" label="工序生产时间定额(分钟)" sortable  min-width="130"></el-table-column>
            <el-table-column prop="isEnable" label="是否启用" sortable :formatter='formartIsEnable' min-width="120"></el-table-column>
            <el-table-column prop="creatorName" label="创建人" sortable min-width="100"></el-table-column>
            <el-table-column prop="createTime" label="创建时间" sortable min-width="160"></el-table-column>
            <el-table-column fixed="right" label="操作" sortable align="center" width="160">
                <template slot-scope="scope">
                    <el-button @click="showDialog1('update',scope.row)" type="text" size="small">编辑</el-button>
                    <el-button @click="showDialog2('',scope.row)" type="text" size="small">配置</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pagination.currentPage" :page-sizes="[5,10, 15,20, 25,30,50, 100]" :page-size="pagination.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"></el-pagination>
           <!-- 弹框1 -->
            <el-dialog :title="dialog1.title" width="800px" center :visible.sync="dialog1.isShow" :close-on-click-modal="false" v-dialogDrag>
                <div :style="tableDialogHeightTabPane">
                    <el-form class="demo-form-inline" v-model="dialog1.formDate" label-position="right" label-width="140px" :inline="true">
                        <el-form-item label="名称"><el-input v-model="dialog1.formDate.name" ></el-input></el-form-item>
                        <el-form-item label="编码"><el-input v-model="dialog1.formDate.code" ></el-input></el-form-item>
                        <el-form-item label="机型">
                              <el-select v-model="dialog1.formDate.type" placeholder="请选择">
                                <el-option
                                v-for="item in allType"
                                :key="item.id"
                                :label="item.type"
                                :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="工序排序"><el-input v-model="dialog1.formDate.rank" ></el-input></el-form-item>
                        <el-form-item label="工序耗时">
                            <el-input placeholder="请输入工序耗时" v-model="dialog1.formDate.useTime" class="inputSuffix">
                                <template slot="append">分钟</template>
                            </el-input>
                        </el-form-item>
                        <el-form-item label="启用"  class='switch100'><el-switch v-model="dialog1.formDate.isEnable"></el-switch></el-form-item>
                        <el-form-item label="创建人" v-if="dialog1.formDate.creatorName"><el-input v-model="dialog1.formDate.creatorName" disabled></el-input></el-form-item>
                        <el-form-item label="创建时间" v-if="dialog1.formDate.creatorName"><el-input v-model="dialog1.formDate.createTime" disabled></el-input></el-form-item>
                    </el-form>
                </div>
                <div slot="footer" class="dialog-footer" style="text-align: center;">
                    <el-button @click="addUpdataConfig" type="primary">确 定</el-button>
                </div>
            </el-dialog>
            <el-dialog :title="dialog2.title" width="90%" center :visible.sync="dialog2.isShow" :close-on-click-modal="false" v-dialogDrag>
                 <div :style="tableDialogHeightTabPane">
                    <el-tabs v-model="activeName" @tab-click="handleClick">
                        <el-tab-pane label="过程配置" name="1">
                              <check-table :list="process.list" @addUpdateCheck='addUpdateCheck'></check-table>
                        </el-tab-pane>
                        <el-tab-pane label="技术标准" name="2">
                            <el-button type="primary" @click="showDialog3()">配置技术标准</el-button>
                            <el-table  :data="sjfile.list" tooltip-effect="dark"  style="width: 100%" >
                                <el-table-column prop="fileName" label="文件名称"> </el-table-column>
                                <el-table-column fixed="right" label="操作" sortable align="center" width="160">
                                    <template slot-scope="scope">
                                        <el-button @click="showDialog4(scope.row)" type="text" size="small">查看</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </el-tab-pane>
                           <el-tab-pane label="对应图纸" name="3">
                         <el-button type="primary" @click="showDialog3()">配置图纸</el-button>
                         <el-table  :data="drawing.list" tooltip-effect="dark"  style="width: 100%" >
                            <el-table-column prop="cidName" label="图纸名称"> </el-table-column>
                            <el-table-column fixed="right" label="操作" sortable align="center" width="160">
                                <template slot-scope="scope">
                                    <el-button @click="deleteDrawing(scope.row)" type="text" size="small">删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-tab-pane>
                    <el-tab-pane label="对应SOP" name="4">
                        <el-button type="primary" @click="showDialog3()">配置SOP</el-button>
                         <el-table  :data="sop.list" tooltip-effect="dark"  style="width: 100%" >
                            <el-table-column prop="fileName" label="SOP名称"> </el-table-column>
                            <el-table-column fixed="right" label="操作" sortable align="center" width="160">
                                <template slot-scope="scope">
                                    <el-button @click="showDialog4(scope.row)" type="text" size="small">查看</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-tab-pane>
                    </el-tabs>
                </div>
            </el-dialog>
            <el-dialog :title="dialog3.title" center :visible.sync="dialog3.isShow" :close-on-click-modal="false" v-dialogDrag>
        <!-- 新增总装物料配置 -->
            <div :style="tableDialogHeightTabPane" v-show="activeName=='1'">
                 <check-config :dialogForm="process.dialogForm"  @addUpdate="addUpdateHandle"></check-config>
            </div>
            <!-- 配置技术标准 -->
            <div :style="tableDialogHeightTabPane" v-show="activeName=='2'">
                  <el-table ref="multipleTable" :data="sjfile.all" tooltip-effect="dark"  style="width: 100%" @selection-change="handleSelectionChange">
                    <el-table-column type="selection" width="55"> </el-table-column>
                    <el-table-column prop="fileName" label="文件名称"> </el-table-column>
                </el-table>
                <div slot="footer" class="dialog-footer" style="text-align: center;">
                    <el-button @click="addFile" type="primary">确 定</el-button>
                </div>
            </div>
             <!-- 配置图纸 -->
            <div :style="tableDialogHeightTabPane" v-show="activeName=='3'">
                 <el-tree
                 ref="drawTress"
                :props="props1"
                node-key="id"
                :load="loadNode"
                lazy
                show-checkbox
                :data="drawing.all">
                </el-tree>
                <div slot="footer" class="dialog-footer" style="text-align: center;">
                    <el-button @click="addDrawing" type="primary">确 定</el-button>
                </div>
            </div>
            <!-- 配置SOP -->
            <div :style="tableDialogHeightTabPane" v-show="activeName=='4'">
                  <el-table ref="sop" :data="sop.all" tooltip-effect="dark"  style="width: 100%" @selection-change="handleSelectionChange1">
                    <el-table-column type="selection" width="55"> </el-table-column>
                    <el-table-column prop="fileName" label="文件名称"> </el-table-column>
                </el-table>
                <div slot="footer" class="dialog-footer" style="text-align: center;">
                    <el-button @click="addSOP" type="primary">确 定</el-button>
                </div>
            </div>
        </el-dialog>
          <el-dialog :title="dialog4.title" width="800px" center :visible.sync="dialog4.isShow" :close-on-click-modal="false" v-dialogDrag>
            <!-- 查看文件内容 -->
            <div :style="{height:'100%',overflowY: 'auto'}">
                <div v-html="dialog4.content"></div>
            </div>
        </el-dialog>
    </div>
</template>
<script>
import machineHttp from '@/axios/machine.js'
import checkConfig from './components/checkConfig.vue'
import checkTable from './components/checkTable.vue'
export default {
    components:{
        checkConfig,
        checkTable
    },
    data(){
        return{
            tableHeight: document.documentElement.clientHeight - 170,/**表格高度 */
            tableDialogHeightTabPane:{/**dialog style */
                height: (document.documentElement.clientHeight - 300) + 'px',
                overflowY: 'auto'
            },
            search:{
                name:'',
                code:'',
                isEnable:'',
                type:''
            },
            allTableData:[],
            tableData:[],/**配置列表 */
            pagination:{/**配置列表分页 */
                currentPage:1,
                pageSize:10,
                total:0
            },
            allType:[],/**机器所有类型 */
            sjfile:{
                all:[],/**所有技术标准 */
                select:[],/**选中的技术标准 */
                list:[]/**技术标准列表 */
            },
            drawing:{
                all:[],/**所有图纸*/
                list:[]
            },
            sop:{
                all:[],/**所有sop*/
                select:[],/**选中的sop*/
                list:[]
            },
            dialog1:{
               title:'',
               isShow:false,
               formDate:{},
               type:''
            },
            props1:{
                label:'drawingName',
                children:'children',
                id: 'id'
            },
            activeName:'1',
            dialog2:{
                title:'',
                isShow:false,
                type:'',
                id:''
            },
            dialog3:{
                title:'',
                isShow:false,
                id:''
            },
             dialog4:{
                title:'',
                isShow:false,
                content:''
            },
             process:{/**过程配置 */
                list:[],/**过程配置列表 */
                dialogForm:{}/**新增或修改表单 */
            },
        }
    },
    created(){
        this.getAllType();
        this.getTableList();
        this.jqcsSettingSjfileAll();
        this.jqcsSettingsSopAll();
    },
    methods:{
        getAllType(){/**获取机型 */
            let self= this;
            machineHttp.selectMachine().then(res=>{
                self.allType=res.content
            })
        },
        jqcsSettingSjfileAll(){
            let self = this;
            machineHttp.jqcsSettingSjfileAll().then(res=>{
                self.sjfile.all=res.content;
            })
        },
        jqcsSettingsSopAll(){
            let self = this;
            machineHttp.jqcsSettingsSopAll().then(res=>{
                self.sop.all=res.content;
            })
        },
        formartIsEnable(row, column, cellValue, index){
            return cellValue == 1 ? '启用' : (cellValue == 0 ? '未启用' : "");
        },
        getTableList(){
            let self = this;
            let postData={
                currentPage:self.pagination.currentPage,
                pageSize:self.pagination.pageSize,
                name:self.search.name,
                code:self.search.code,
                isEnable:self.search.isEnable,
                type:self.search.type
            }
            machineHttp.jqcsConfigList(postData).then(res=>{
                self.tableData=res.content.records;
                self.pagination.total=res.content.total;
            })
        },
        searchData(){
            let self = this;
            self.pagination.currentPage =1;
            self.getTableList();
        },
        showDialog1(type,row){
            let self= this;
            self.dialog1.type=type;
            self.dialog1.title= type=='insert'?'添加配置':'修改配置';
            self.dialog1.isShow=true;
            self.dialog1.formDate= type=='insert'?{
                name:'',
                code:'',
                type:'',
                isEnable:true,
                rank:'',
                useTime:'',
            }:{
                id:row.id,
                name:row.name,
                code:row.code,
                type:Number(row.type),
                creator:row.creator,
                creatorName:row.creatorName,
                createTime:row.createTime,
                isEnable:row.isEnable==1?true:false,
                rank:row.rank,
                useTime:row.useTime,
            }
        },
        addUpdataConfig(){
            let self = this;
            let data={
                id:self.dialog1.formDate.id,
                name:self.dialog1.formDate.name,
                code:self.dialog1.formDate.code,
                type:self.dialog1.formDate.type,
                creator:self.dialog1.formDate.creator,
                creatorName:self.dialog1.formDate.creatorName,
                createTime:self.dialog1.formDate.createTime,
                isEnable:self.dialog1.formDate.isEnable?1:0,
                rank:self.dialog1.formDate.rank,
                useTime:self.dialog1.formDate.useTime,
            }
            machineHttp.addUpdatejqcsConfig(self.dialog1.type,data).then(res=>{
                self.$message.success(`${self.dialog1.title}成功`);
                 self.dialog1.isShow=false;
                 self.getTableList();
            },error=>{
                 self.$message.error(`${self.dialog1.title}成功`);
            })
        },
        handleSizeChange(size){
            let self = this;
            self.pagination.currentPage=1;
            self.pagination.pageSize=size;
            self.getTableList();
        },
        handleCurrentChange(current){
            let self = this;
            self.pagination.currentPage=current;
            self.getTableList();
        },
        showDialog2(type,row){
            let self = this;
            self.dialog2.isShow=true;
            self.dialog2.title='配置';
            self.dialog2.id=row.id
            self.dialog2.type= row.type;
            self.activeName='1';
            self.getProcessConfigList();
        },
        handleClick(tab, event){
             let  self= this;
           switch(self.activeName){
               case '1':
                   self.getProcessConfigList();
                   break;
                case '2':
                  self.getSelectSjfile();
                    break;
                case '3':
                  self.getDrawingList();
                    break;
                case '4':
                   self.getSOPList();
                break;
           }
        },
        getSelectSjfile(){
            let self = this;
            machineHttp.selectSjfile(self.dialog2.id).then(res=>{
               self.sjfile.list=res.content;
            })
        },
        getDrawingList(){
             let self=this;
            machineHttp.jqcsSettingDrawsSelect(self.dialog2.id).then(res=>{
                self.drawing.list=res.content;
            })
        },
        getSOPList(){
             let self=this;
            machineHttp.jqcsSettingsSopSelect(self.dialog2.id).then(res=>{
               self.sop.list=res.content;
            })
        },
        showDialog3(){
            let self=this;
              switch(self.activeName){
               case '1':
                   self.dialog3.title=`${type==='insert'?'新增':'修改'}过程配置`;
                    self.process.dialogForm = (type==='insert'?{
                        pid:self.materielForm.pid,
                        name:'',//名字
                        reference:'',//参考值
                        unit:'',//单位
                        type:'',//类型
                        isEnable:'1'//是否使用
                    }:{
                        id:row.id,
                        pid:row.pid,
                        name:row.name,//名字
                        reference:row.reference,//参考值
                        unit:row.unit,//单位
                        type:row.type,//类型
                        isEnable:String(row.isEnable)//是否使用
                    });
                   break;
                case '2':
                    self.dialog3.title="配置技术标准";
                     setTimeout(function(){
                        if(self.sjfile.list.length>0){
                        self.sjfile.all.forEach((item,i)=>{
                            self.sjfile.list.forEach(el=>{
                                if(item.fileId==el.fileId){
                                    self.$refs.multipleTable.toggleRowSelection(self.sjfile.all[i],true);
                                }
                            })
                        })
                     }
                    },60)
                    break;
                case '3':
                      self.dialog3.title="配置图纸";
                      machineHttp.jqcsSettingDrawsAll(self.dialog2.type,0).then(res=>{
                            self.drawing.all=res.content;
                        })
                       setTimeout(function(){
                         self.getDrawingList();
                        },60)
                    break;
                  case '4':
                    self.dialog3.title="SOP配置";
                    setTimeout(function(){
                        if(self.sop.list.length>0){
                        self.sop.all.forEach((item,i)=>{
                            self.sop.list.forEach(el=>{
                                if(item.fileId==el.fileId){
                                    self.$refs.sop.toggleRowSelection(self.allSOP[i],true);
                                }
                            })
                        })
                        }
                    },60)
                break;
           }
           self.dialog3.isShow=true;
        },
        handleSelectionChange(val){
            let self = this;
            self.sjfile.select=val;
        },
        handleSelectionChange1(val){
            let self = this;
            self.sop.select=val;
        },
        addFile(){
             let self = this;
            let postData=[];
            if(self.sjfile.select.length>0){
                self.sjfile.select.forEach(item=>{
                    postData.push({
                        pid:self.dialog2.id,
                        cid:item.fileId
                    })
                })
            }
            machineHttp.addSjfile(postData).then(res=>{
                self.$message.success(`标准文件配置成功`);
                 self.dialog3.isShow=false;
                 self.getSelectSjfile();
            },error=>{
                self.$message.error(`标准文件配置失败`);
            })
        },
        addDrawing(){
             let self = this;
            let selectArray=self.$refs.drawTress.getCheckedKeys();
            let postData=[];
            selectArray.forEach(el=>{
                postData.push({
                    pid:self.dialog2.id,
                    cid:el
                })
            })
            machineHttp.addJqcsSettingDraws(postData).then(res=>{
                 self.$message.success(`图纸配置成功`);
                 self.dialog3.isShow=false;
                 self.getDrawingList();
            },error=>{
                 self.$message.error(`图纸配置失败`);
            })
        },
        addSOP(){
              /**修改sop配置 */
            let self = this;
            let postData=[];
            if(self.sop.select.length>0){
                self.sop.select.forEach(item=>{
                    postData.push({
                        pid:self.dialog2.id,
                        cid:item.fileId
                    })
                })
            }
            machineHttp.addJqcsSettingsSop(postData).then(res=>{
                self.$message.success(`SOP配置成功`);
                 self.dialog3.isShow=false;
                 self.getSOPList();
            },error=>{
                self.$message.error(`SOP配置失败`);
            })
        },
        showDialog4(row){
           let self = this;
            self.dialog4.isShow =true;
            self.dialog4.title=row.fileName;
            self.dialog4.content=row.initialContent;
        },
        getProcessConfigList(){/**获取过程信息配置列表 */
            let self=this;
            machineHttp.jqcsSettingProcessList(self.dialog2.id).then(res=>{
                self.process.list=res.content;
            })
        },
        addUpdateCheck(data){
            let self = this;
            self.dialog3.isShow =true;
            let type= data.type;
            let row=data.row;
            switch(self.activeName){
                 case '1':
                    self.dialog3.title=`${type==='insert'?'新增':'修改'}过程配置`;
                    self.process.dialogForm = (type==='insert'?{
                        pid:self.dialog2.id,
                        name:'',//名字
                        reference:'',//参考值
                        unit:'',//单位
                        type:'',//类型
                        rank:'',
                        isEnable:'1',//是否使用
                        remark:'',
                        creatorName:'',
                        createTime:''
                    }:{
                        id:row.id,
                        pid:row.pid,
                        name:row.name,//名字
                        reference:row.reference,//参考值
                        unit:row.unit,//单位
                        type:row.type,//类型
                        rank:row.rank,
                        isEnable:String(row.isEnable),//是否使用
                        remark:row.remark,
                        creatorName:row.creatorName,
                        createTime:row.createTime
                    });
                break;
            }
        },
         addUpdateHandle(data){
            let self = this,
            type=self.dialog3.title.indexOf('新增')>-1?'insert':'update';
            switch(self.activeName){
                case '1':/**新增修改过程配置 */
                    machineHttp.addUpdateJqcsSettingProcess(type,data).then(res=>{
                        self.getProcessConfigList();
                        self.dialog3.isShow=false;
                        self.$message.success(`${self.dialog3.title}成功`)
                    },error=>{
                        self.$message.error(`${self.dialog3.title}失败`)
                    })
                break;
            }
        },
         loadNode(node, resolve){
            let self = this;
            if(node.level!==0){
                machineHttp.jqcsSettingDrawsAll(self.dialog2.type,node.data.id).then(res=>{
                    resolve(res.content);
                })
            }
        },
        deleteDrawing(row){
             let self = this;
            self.$confirm('是否移除图纸?', '提示', {
            confirmButtonClass: 'el-button--warning'
            }).then(() => {
                machineHttp.jqcsRemoveDraws(row.id).then(res=>{
                    self.$message.success(`移除图纸成功`);
                    self.getDrawingList();
                },error=>{
                    self.$message.error(`移除图纸成功`);
                })
            }).catch(() => {})
        }
    }
}
</script>
<style scoped>

</style>

